<template>
  <form-item-wrapper
    :designer="designer"
    :field="field"
    :rules="rules"
    :design-state="designState"
    :parent-id="parentId"
    :parent-list="parentList"
    :index-of-parent-list="indexOfParentList"
  >
    <el-button
      ref="fieldEditor"
      :type="field.options.buttonType"
      :size="field.options.size"
      :plain="field.options.plain"
      :round="field.options.round"
      :circle="field.options.circle"
      :icon="field.options.icon"
      :disabled="field.options.disabled"
      @click.native="handleButtonWidgetClick"
    >
      {{ field.options.buttonLabel }}
    </el-button>
  </form-item-wrapper>
</template>

<script>
/* eslint-disable vue/require-default-prop */
/* eslint-disable eol-last */
import FormItemWrapper from "./form-item-wrapper";
import emitter from "Yan/utils/emitter";
import i18n from "Yan/utils/i18n";
import fieldMixin from "./fieldMixin";

export default {
  name: "button_unit",
  componentName: "FieldWidget",
  components: { FormItemWrapper },
  mixins: [emitter, fieldMixin, i18n],
  props: {
    designer: Object,
    fieldId: String,
    parentId: String,
    parentList: Array,
    indexOfParentList: Number,
    formData: Object,
    designState: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      rules: [],
    };
  },
  created() {
    /* 注意：子组件mounted在父组件created之后、父组件mounted之前触发，故子组件mounted需要用到的prop
         需要在父组件created中初始化！！ */
    // this.registerToRefList()
    this.initEventHandler();

    this.handleOnCreated();
  },

  mounted() {
    this.handleOnMounted();
  },
};
</script>

<style lang="scss" scoped>
@import "../../../../styles/global.scss"; //* static-content-wrapper已引入，还需要重复引入吗？ *//
</style>
